<script setup>
// 引入 api
import { ref } from "vue"

// 内容
const content = ref('')

// 复选框列表
const checkboxList = ref(["唱歌", "跳舞", "打游戏", "看电影", "打篮球"])

// 选中的列表
const checks = ref([])


// 点击函数
function btn() {
    content.value = checks.value
}
</script>

<template>
    <!-- 按钮 -->
    <template v-for="item in checkboxList">
        <input type="checkbox" :value="item" v-model="checks">{{ item }}
    </template>
    <br>
    <input type="button" value="显示" @click="btn">

    <!-- 渲染 -->
    <p>{{ content }}</p>
</template>